<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<title>修改手机号</title>
		<meta name="keywords" content="知果汇" />
		<meta name="description" content="知果汇" />
		<link rel="SHORTCUT ICON" href="_IMG_/favicon.ico" />
		<link rel="stylesheet" href="_CSS_/form.css" />
		<link rel="stylesheet" href="_CSS_/reg.css" />
		<style type="text/css">
			h5{font-size: 20px;text-align:center;font-weight: normal;}
			.fillBox{width: 338px;display: inline-block;}
			.form-group{line-height: 40px;width: 420px;margin: 0 auto 20px auto;}
			.form-control{background: #F4F4F4;width: 290px;padding: 0 38px 0 10px;height: 40px;line-height: 40px;}
		</style>
	</head>
	<body>
		<form id="form1" action="" method="post" class='forms'>
			<h5>修改手机号</h5>
			<div class='form-group'>
				<label>原手机号：</label>
				<input class='form-control init' type='tel' placeholder="请输入原手机号码"/>
			</div>
			<div class='form-group'>
				<label>新手机号：</label>
				<input class='form-control new' type='tel' placeholder="请输入新手机号码"/>
			</div>
			<div class='form-group'>
				<label>验证码：</label>
				<div class="fillBox code">
					<input class="codeNum" type="number" placeholder="请填写收到的验证码" oninput="if(value.length>6)value=value.slice(0,6)">
					<button type="button" class="sendSms">发送验证码</button>
				</div>	
			</div>
		</form>
	</body>
	<script src="_JS_/jquery-1.8.3.min.js"></script>
	<script src="_JS_/jquery.base64.js"></script>
	<script src="_JS_/jquery.cookie.js"></script>
	<script src="_JS_/common.js"></script>
	<script src="_P_/layer/layer.js"></script>
	<script type="text/javascript">
		$(function(){
			var url = window.location.href;
			var type = url.split("=")[1];
			if(type==2){
				$('.form-group').eq(0).empty();
			}
			/*发送验证码，倒计时60s*/
			var clock = '';
			var nums = 60;
			var btn;
			$(".sendSms").click(function(){
				btn=this;
				//*手机验证码*/
				var phone = $('.new').val();
				var myreg = /^((1[3,5,8][0-9])|(14[5,7])|(17[0,6,7,8]))\d{8}$/;
				if(!myreg.test(phone)){
					layer.msg('手机号格式输入不正确！', {icon: 5});
				}else{
					/*验证手机是否被注册过*/
					$.ajax({
						dataType:"jsonp",
						url:"/index.php/api/User/check_user",
						data:{
							'message':phone,
							'status':0,
						},
						type:'get',
						timeout:80000,
						success:function(msg){
							if(msg.code == 200){
								sendSms(phone,3);
								btn.disabled = true; //将按钮置为不可点击
								btn.innerHTML = nums+'秒后可重新获取';
								btn.style.color = "#999";
								clock = setInterval(doLoop, 1000); //一秒执行一次
							}else{
								layer.msg('该手机号已在平台注册过！', {icon: 5});
							}
						},
						error:function(){
							console.log("网络错误");
						}
					});
				}
			});
			function doLoop(){
				nums--;
				if(nums > 0){
					btn.innerHTML = nums+'秒后可重新获取';
					btn.style.color = "#999";
				}else{
				  	clearInterval(clock); //清除js定时器
				  	btn.disabled = false;
				  	btn.innerHTML = '发送验证码';
				  	btn.style.color = "#3377c1";
				  	nums = 60; //重置时间
				}
			}
		});
		/*发送手机验证码*/
		function sendSms(phone,status){
			$.ajax({
				dataType:"jsonp",
				url:"/index.php/api/Message/sms",
				data:{
					'phone':phone,
					'status':status,
				},
				type:'get',
				timeout:30000,
				success:function(msg){
					if(msg.code == 200){
						layer.msg('验证码已经发送到您的手机，请注意查收！', {icon: 1});
					}else{
						var message = msg.message;
						layer.msg(message, {icon: 5});
					}
				},
				error:function(){
					console.log("网络错误");
				}
			});
		}
	</script>
</html>
